<template>
    <div class="container">
        <div class="header">
            <span>天作云服务商工作台</span>
            <img src="~@/assets/images/tzy-logo.png" alt="" />
        </div>
        <div class="body">
            <div class="title">
                <img src="@/assets/images/login/join.png" alt="" />
            </div>
            <div>
                <p>您好！</p>
                <p>
                    首先，请填写您企业的入驻资料，我们将为您推荐更适合您的起步方式，<br />
                    助您成功发展！
                </p>
            </div>
            <div class="btn" @click="handeleJump">立即入驻</div>
        </div>
        <div class="footer">
            <p>官方客服：400-8618-890</p>
            <p>Copyright 2021 成都天作云科技有限公司 All Rights Reserved 蜀ICP备 20011376号-2</p>
        </div>
    </div>
</template>

<script>
import { localStorage } from '~/plugins/tools'

export default {
    name: 'Welcome',
    layout: 'welcome-layout',
    head () {
        return {
            title: '欢迎入驻'
        }
    },
    created () {
        if (process.client && localStorage.getItem('refresh') === 'refresh') {
            localStorage.removeItem('refresh')
            window.location.reload()
        }
    },
    methods: {
        handeleJump () {
            this.$router.push({
                name: 'settled'
            })
        }
    }
}
</script>

<style lang="less" scoped>
.container {
    width: 100%;
    height: 100%;
    background-image: url('~@/assets/images/login/bg03.png');
    background-size: cover;
    overflow: hidden;
}

.header {
    margin: 0.6rem auto 0;
    padding-left: 3.6rem;
    span {
        color: @primary-color;
        font-size: 0.32rem;
        font-weight: bold;
    }
    img {
        margin-left: 8.47rem;
        width: 0.66rem;
        height: 0.66rem;
    }
}

.body {
    margin: 1.5rem auto 0;
    padding-left: 3.6rem;
    .title {
        margin-bottom: 0.3rem;
        img {
            height: 0.66rem;
        }
    }
    p {
        font-size: 0.32rem;
        line-height: 0.45rem;
        color: #232830;
        margin-bottom: 0.2rem;
    }
    p:last-child {
        margin-bottom: 0;
    }
    button {
        margin-top: 1rem;
        font-size: 0.16rem;
    }
}

.footer {
    margin-top: 1rem;
    p:first-child {
        padding-left: 3.6rem;
        font-size: 0.2rem;
        font-family: DIN;
        font-weight: 400;
        line-height: 0.25rem;
        color: #2a2a2a;
    }
    p:last-child {
        margin-top: 0.6rem;
        text-align: center;
        font-size: 0.16rem;
        font-family: PingFang SC;
        font-weight: 400;
        line-height: 0.22rem;
        color: #78808d;
    }
}

.btn {
    margin-top: 1rem;
    width: 3rem;
    height: 0.8rem;
    background: #ffffff;
    box-shadow: 0 0 0.1rem rgba(0, 153, 68, 0.7);
    opacity: 1;
    border-radius: 0.4rem;

    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.32rem;
    font-weight: 400;
    color: @primary-color;
    cursor: pointer;
}
</style>
